<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>注册</title>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <style>
      input {
        margin: 10px 0;
      }
    </style>
  </head>

  <body>
    <header>
      <div class="accound">
        <a href="login.html" class="active">登陆</a>
        <a href="register.html">注册</a>
      </div>
    </header>

    <div class="container">
      <form class="form-register">
        <h2 class="form-register-heading">请注册</h2>
        <label for="inputEmail" class="sr-only">邮箱</label>
        <input type="email" id="inputEmail" class="form-control" placeholder="邮箱" required autofocus>
        <label for="inputPassword" class="sr-only">密码</label>
        <input type="password" id="inputPassword" class="form-control" placeholder="密码" required>
        <label for="aff-inputPassword" class="sr-only">确认密码</label>
        <input type="password" id="aff-inputPassword" class="form-control" placeholder="确认密码" required>
        <button class="btn btn-lg btn-primary btn-block" type="button">注册</button>
      </form>

    </div> <!-- /container -->
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script>
      let $btn = $(".form-register .btn");
      let $usr = $("#inputEmail"); 
      let $pwd = $("#inputPassword");
      $btn.click(() => {
        let data = {
          usr: $usr.val(),
          pwd: $pwd.val()
        }
        $.ajax({
          url: "http://localhost:82/register.php",
          type: "post",
          data,
          success(res) {
            if (res == 200) {
              alert("注册成功，可以去登陆了");
            } 
            if (res == 400) {
              alert("此账号以注册过了");
            }
          },
          error(err) {
            alert(400)
          }
        })
      })
    </script>
  </body>
</html>
